/*4.12 面板
  name:      hui-panel
  sample:
  <div class="hui-panel hui-panel-default">
    <div class="hui-panel-body">默认面板</div>
  </div>
*/
.hui-panel {
  background-color: #fff;
  border: solid 1px transparent;
  .hui-panel-header {
    border-bottom: solid 1px transparent;
    padding: 8px 15px;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: -1px;
  }
  .hui-panel-body {
    padding: 15px;
  }
  .hui-panel-footer {
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding: 5px 20px;
  }
  /*默认面板*/
  &.hui-panel-default {
    border-color: #ddd;
    >.hui-panel-header {
      border-color: #ddd;
      background-color: #f5f5f5;
      color: #444;
    }
  }
  /*主要面板*/
  &.hui-panel-primary {
    border-color: #5a98de;
    >.hui-panel-header {
      border-color: #5a98de;
      background-color: #5a98de;
      color: #fff;
    }
  }

  /*次要面板*/
  &.hui-panel-secondary {
    border-color: #3bb4f2;
    >.hui-panel-header {
      border-color: #3bb4f2;
      background-color: #3bb4f2;
      color: #fff;
    }
  }

  /*成功面板*/
  &.hui-panel-success {
    border-color: #5eb95e;
    >.hui-panel-header {
      border-color: #5eb95e;
      background-color: #5eb95e;
      color: #fff;
    }
  }

  /*警告面板*/
  &.hui-panel-warning {
    border-color: #f37b1d;
    >.hui-panel-header {
      border-color: #f37b1d;
      background-color: #f37b1d;
      color: #fff;
    }
  }

  /*危险面板*/
  &.hui-panel-danger {
    border-color: #dd514c;
    >.hui-panel-header {
      border-color: #dd514c;
      background-color: #dd514c;
      color: #fff;
    }
  }
}